const Vue = require('vue')
const express = require('express')
const fs = require('fs')
// 渲染器
const renderer = require('vue-server-renderer').createRenderer({
  template: fs.readFileSync('./index.template.html', 'utf-8')
})

const server = express()

// 访问根路径时执行
server.get('/', (req, res) => {
  const app = new Vue({
    template: `
            <div id="app">
                <h1>{{message}}</h1>
            </div>
        `,
    data: {
      message: '拉勾教育'
    } 
  })

  // 编译vue模板 渲染完整的页面模板
  renderer.renderToString(app, {
    title: 'hi',
    meta: `
    <meta name="description" content="拉勾教育">
  `,
  }, (err, html) => {
    if (err) {
      return res.status(500).end('Internal Server Error')
    }
    // 设置响应头使网页正确识别
    res.setHeader('Content-Type', 'text/html; charset=utf8')
    res.end(html)
  })
})


// 启动服务器并设置端口
server.listen(3000, () => {
  console.log('server running at port 3000.')
})
